/* eslint-disable import/no-extraneous-dependencies */
const path = require('path');
const webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin'); // 独立打包文件
const HtmlWebPackPlugin = require('html-webpack-plugin'); // 生成Html模版
// const HtmlWebPackChunkPlugin = require('html-webpack-inline-chunk-plugin'); // 将文件内联块至Html

// postcss 插件
const cssVariables = require('postcss-css-variables'); // 定义全局样式
const postcssFunctions = require('postcss-functions'); // 定义全局样式方法
const autoprefixer = require('autoprefixer'); // 浏览器兼容自动补全

const isPack = process.env.NODE_ENV === 'test'; // 打包-开发

module.exports = {
  devtool: isPack ? 'source-map' : 'eval-source-map',
  entry: {
    vendor: [
      'babel-polyfill',
      'react',
      'react-router',
      'redux',
      'react-redux',
      'redux-thunk',
    ],
    app: [
      './src/style.css',
      './src/main',
    ],
  },
  output: {
    path: './dist',
    publicPath: 'http://192.168.1.153:9999/',
    filename: 'js/[name].js', // 页面需引用这个压缩的文件
  },
  devServer: {
    port: 9999, // 更改端口
    host: '0.0.0.0',
    stats: { // 阻止打印一大串的内容
      colors: true,
      chunks: false,
    },
    historyApiFallback: true,
    // proxy: {
    //   '*': {
    //     target: 'http://192.168.1.153:9999',
    //     secure: false,
    //     /* eslint-disable consistent-return */
    //     bypass(req) {
    //       if (req.headers.accept.includes('text') || req.url.includes('.')) {
    //         return req.url;
    //       }
    //     },
    //     /* eslint-enable consistent-return */
    //   },
    // },
  },
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        loader: 'babel-loader!eslint-loader',
        exclude: /node_modules/,
        // query: { presets: ['es2015', 'react'] },
      },
      {
        test: /\.css$/,
        loader: isPack ? ExtractTextPlugin.extract('css-loader?sourceMap!postcss-loader') :
        'style-loader!css-loader?sourceMap!postcss-loader',
      },
      {
        test: /\.(png|jpg)$/, loader: 'file-loader?name=media/[name].[hash:8].[ext]',
      },
    ],
  },
  resolve: {
    // 解决后缀
    extensions: ['', '.js', '.jsx'],
    // 解决根目录绝对路径
    root: [
      path.resolve(__dirname, './node_modules'),
    ],
    // 解决别名
    alias: {
      // containers: path.resolve(__dirname, './src/containers'),
    },
  },
  plugins: [
    new webpack.optimize.CommonsChunkPlugin({
      name: ['vendor'],
    }),
    new HtmlWebPackPlugin({
      template: './src/index.html',
    }),
  ].concat([
    new ExtractTextPlugin('./css/[name].css'),
    new webpack.NoErrorsPlugin(),
  ]),

  postcss() {
    return [
      cssVariables({ // 全局样式
        variables: {
          '--success': '#4acb0c',
        },
      }),
      postcssFunctions({ // 全局尺寸计算方法
        functions: {
          px2rem(px) { return `${px / 75}rem`; },
        },
      }),
      autoprefixer(), // 浏览器兼容自动不全
    ];
  },
};
